﻿
@{
    ViewBag.Title = "CheckIn";
    Layout = "~/Views/Shared/_Index.cshtml";
}
<link href="~/Content/Kalendae/kalendae.css" rel="stylesheet" />
<script src="~/Content/Kalendae/kalendae.standalone.js"></script>
<style>
    .kalendae .k-days span {
        /* 水平居中 */
        text-align: center;
        width: 12.8%;
        /* 高度 4.5em效果比较好 height等于line-height就能垂直居中了 */
        height: 4.5em;
        line-height: 4.5em;
        padding: 2px 3px 2px 2px;
        border: 1px solid transparent;
        border-radius: 3px;
        color: #999;
    }
</style>
<div class="place">
    <span>位置：</span>
    <ul class="placeul">
        <li><a href="#">首页</a></li>
        <li><a href="#">考勤记录</a></li>
    </ul>
</div>
<div class="formbody">
    <ul class="seachform">
        <li>
            <label>开始日期:</label>
            <input type="text" class="dfinput Wdate" id="StartDate" style="height:34px" placeholder="开始日期" onFocus="WdatePicker()" value="@DateTime.Now.AddDays(-7).ToString("yyyy-MM-dd")" />
        </li>  <li>
    <label>结束日期:</label>
    <input type="text" class="dfinput Wdate" id="EndDate" style="height:34px" placeholder="结束日期" onFocus="WdatePicker()" value="@DateTime.Now.ToString("yyyy-MM-dd")" />
</li>

        <li>
            <label>&nbsp;</label>
            <input name="" id="ok" type="button" class="scbtn" value="查询" />
            <label>&nbsp;</label>
            @*<input name="" id="export" type="button" class="scbtn" value="导出" />*@
          
           
            <input name="" id="export" type="button" class="scbtn" value="导出EXCEL" onclick="fnExport()" />
        </li>
    </ul>
</div>
<div class="table-content">
    <table id="table" class="tablelist"></table>
</div>
<script type="text/javascript" charset="utf-8">
   
    $(function () {
        var $table = $('#table'), $ok = $('#ok');
        $ok.click(function () {
            $table.bootstrapTable('refresh');
        });

        function queryParams(params) {
            $('#toolbar').find('input[name]').each(function () {
                params[$(this).attr('name')] = $(this).val();
            });
            //params["UserName"] = $("#UserName").val();
            params["StartDate"] = $("#StartDate").val();
            params["EndDate"] = $("#EndDate").val();
            return params;
        }

        function responseHandler(res) {
            return res.rows;
        }
        $('#table').bootstrapTable({
            url: '/AccessRecord/GetCheckIn',
            //url: '/api/Document/GetList',
            pagination: true,
            sidePagination: "server",           //分页方式：client客户端分页，server服务端分页（*）
            pageNumber: 1,                       //初始化加载第一页，默认第一页
            pageSize: 10,                       //每页的记录行数（*）
            pageList: [10],        //可供选择的每页的行数（*）
            //search: true,   //是否显示表格搜索，此搜索是客户端搜索
            striped: true,
            queryParams: queryParams,
            //responseHandler:responseHandler,
            toolbar: "#toolbar",
            columns: [{
                field: 'Number',
                title: '序号',
                align: 'center',
                width: 50,
                formatter: function (value, row, index) {
                    //return index + 1;
                    var pageSize = $('#table').bootstrapTable('getOptions').pageSize;//通过表的#id 可以得到每页多少条
                    var pageNumber = $('#table').bootstrapTable('getOptions').pageNumber;//通过表的#id 可以得到当前第几页
                    return pageSize * (pageNumber - 1) + index + 1;//返回每条的序号： 每页条数 * （当前页 - 1 ）+ 序号
                }
            }, {
                field: '月份',
                title: '月份'
            }, {
                    field: '姓名',
                    title: '姓名'
            },
            {
                field: '工号',
                title: '工号'
            },
            {
                field: '部门',
                title: '部门'
            },
            {
                field: '应出勤',
                title: '应出勤'
                },
                {
                    field: '实际出勤',
                    title: '实际出勤'
                },
                {
                    field: '正常出勤',
                    title: '正常出勤'
                },
                {
                    field: '迟到',
                    title: '迟到'
                },
                {
                    field: '早退',
                    title: '早退'
                },
                {
                    field: '缺勤',
                    title: '缺勤'
                }]
        });

     


    })
    function fnExport() {
        window.open("../AccessRecord/ExcelImport")
    }
</script>